// >>> Primary
@yx-primary-color: #ffffff;
@yx-primary-color-hover: #f7f9fa;
@yx-primary-color-active: #ebf3fc;
@yx-primary-color-outline: #f0f1f2;
@yx-primary-text-color: #333333;
@yx-primary-font-size: 14px;
@yx-primary-button-color: #337eff;
@yx-primary-border-radius: 4px;
@yx-primary-icon-color: #c1c8d1;
@yx-primary-placeholder-color: #bfbfbf;
@yx-primary-reminder-color: #f24957;
@yx-primary-error-color: #e74646;
@yx-primary-content-empty-color: #e6605c;
@yx-primary-success-color: #42c294;
@yx-primary-box-shadow-color: 0 4 8 #85888c;
@yx-primary-dialog-others-box-color: #e8eaed;
@yx-primary-dialog-myself-box-color: #d6e5f6;

// >>> Font-size
@yx-font-size-12: @yx-primary-font-size - 2;
@yx-font-size-16: @yx-primary-font-size + 2;
@yx-font-size-17: @yx-primary-font-size + 3;
@yx-font-size-18: @yx-primary-font-size + 4;
@yx-font-size-20: @yx-primary-font-size + 6;
@yx-font-size-22: @yx-primary-font-size + 8;
@yx-font-size-23: @yx-primary-font-size + 9;
@yx-font-size-24: @yx-primary-font-size + 10;
@yx-font-size-32: @yx-primary-font-size + 18;

// >>> Border-radius
@yx-border-radius-8: @yx-primary-border-radius + 4;
@yx-border-radius-10: @yx-primary-border-radius + 6;
@yx-border-radius-12: @yx-primary-border-radius + 8;
@yx-border-radius-14: @yx-primary-border-radius + 10;
@yx-border-radius-16: @yx-primary-border-radius + 12;
@yx-border-radius-18: @yx-primary-border-radius + 14;

// >>> Background
@yx-background-color-1: #f6f8fa;
@yx-background-color-2: #e8eaed;
@yx-background-color-3: #d6e5f6;
@yx-background-color-4: #ecf0f4;
@yx-background-color-5: #d7e4ff;
@yx-background-color-6: #f1f5f8;
@yx-background-color-7: #f1f4f8;
@yx-background-color-8: #e9eaec;

// >>> Icon
@yx-icon-color-1: #656a72;
@yx-icon-color-2: #c1c8d1;
@yx-icon-color-3: #537ff4;
@yx-icon-color-4: #1861df;
@yx-icon-color-5: #d7dadd;

// >>> Text
@yx-text-color-1: #666666;
@yx-text-color-2: #999999;
@yx-text-color-3: #b3b7bc;
@yx-text-color-4: #2a6bf2;
@yx-text-color-5: #1890ff;
@yx-text-color-6: #dbdde4;
@yx-text-color-7: #e74646;
@yx-text-color-8: #90959d;

// >>> Border-color
@yx-border-color-1: #d3d5d7;
@yx-border-color-2: #f0f1f2;
@yx-border-color-3: #e4e9f2;
@yx-border-color-4: #dde0e5;
@yx-border-color-5: #d7e4ff;
@yx-border-color-6: #c1c8d1;
@yx-border-color-7: #dbe0e8;
@yx-border-color-8: #e6e6e6;
@yx-border-color-9: #ebedf0;
@yx-border-color-10: #e0e0e0;

// >>> Button-color
@yx-button-color-1: #f7f7f7;
@yx-button-color-2: #d9d9d9;
@yx-button-color-3: #ff4d4f;
@yx-button-disabled-color-1: #f7f7f7;
@yx-button-disabled-color-2: #f7f7f7;

// >>> Avatar
@yx-avatar-color-1: #60cfa7;
@yx-avatar-color-2: #53c3f3;
@yx-avatar-color-3: #537ff4;
@yx-avatar-color-4: #854fe2;
@yx-avatar-color-5: #be65d9;
@yx-avatar-color-6: #e9749d;
@yx-avatar-color-7: #f9b751;
